<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
	<link href="/static/css/bootstrap.min.css" rel="stylesheet">
	<script src="/static/js/jquery-1.11.1.min.js"></script>
	<script src="/static/js/bootstrap.min.js"></script>
	<script src="/static/js/app.js"></script>

	<link rel="stylesheet" href="/static/X-admin/css/font.css">
	<link rel="stylesheet" href="/static/X-admin/css/xadmin.css">
	<script src="/static/X-admin/lib/layui/layui.js" charset="utf-8"></script>
	<script type="text/javascript" src="/static/X-admin/js/xadmin.js"></script>
	<style>
		html,body{
			margin: 0;padding: 0;border:0;
		}
		.img{
			border: 1px gray solid;
			border-radius: 10px;
			width: 160px;
			height: 245px;
			text-align: center;
			float: left;
			margin: 10px 25px;
		}
		.img1{
			width: 150px;
			height: 150px;
			margin: 5px 4px;
			border-radius: 10px
		}
		.img:after{content: " ";display: table;width: 0;height: 0;clear: both}

		.imgs{
			border: 1px gray solid;
			border-radius: 10px;
			width: 160px;
			height: 275px;
			text-align: center;
			float: left;
			margin: 10px 25px;
		}
	</style>
</head>
<body>
<!--	-&#45;&#45;&#45;&#45;导航条开始&#45;&#45;&#45;&#45;-->
	<nav class="navbar navbar-default">
		<div class="container-fluid">
			<div class="navbar-header">
				<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
					<span class="sr-only">Toggle navigation</span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
					<span class="icon-bar"></span>
				</button>
				<a class="navbar-brand" href="{:url('Login/index')}">图书管理系统</a>
			</div>

			<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
				<ul class="nav navbar-nav">
					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">会员管理<span class="caret"></span></a>
						<ul class="dropdown-menu">
							<li><a href="{:url('Login/vip_zhuce')}">会员注册</a></li>
							<li><a href="{:url('Login/vip_biao')}">会员列表</a></li>
							<li role="separator" class="divider"></li>
							<li><a href="{:url('Login/vip_chong')}">会员充值</a></li>
						</ul>
					</li>

					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">书籍管理<span class="caret"></span></a>
						<ul class="dropdown-menu">
							<li><a href="{:url('Login/shangjia')}">新书上架</a></li>
							<li><a href="{:url('Login/books')}">书籍列表</a></li>
							<li><a href="{:url('Login/fenlei')}">添加分类</a></li>
						</ul>
					</li>

					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">关于我们<span class="caret"></span></a>
						<ul class="dropdown-menu">
							<li><a href="{:url('Login/about')}">关于我们</a></li>
						</ul>
					</li>

					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">员工信息<span class="caret"></span></a>
						<ul class="dropdown-menu">
							<li><a href="{:url('Login/work')}">员工列表</a></li>
						</ul>
					</li>

					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">历史记录<span class="caret"></span></a>
						<ul class="dropdown-menu">
							<li><a href="#">借还记录</a></li>
						</ul>
					</li>

					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">账号管理<span class="caret"></span></a>
						<ul class="dropdown-menu">
							<li><a href="{:url('Login/update')}">修改密码</a></li>
							<li data-toggle="modal" data-target="#z"><a href="#">注销账号</a></li>
							<li role="separator" class="divider"></li>
							<li><a href="{:url('Login/out')}">退出登录</a></li>
						</ul>
					</li>
				</ul>
				<ul class="nav navbar-nav navbar-right">
					<li class="dropdown">
						<a href="#" class="dropdown-toggle"  role="button" aria-haspopup="true" aria-expanded="false">昵称：{$name}</a>
					</li>
				</ul>
			</div>
		</div>
	</nav>
	<!--	-&#45;&#45;&#45;&#45;导航条结束&#45;&#45;&#45;&#45;-->


	<div class="row" style="margin: auto">
		<!--	左侧边栏开始-->
		<div class="col-xs-3">
			<div class="list-group" id="vip">
					<span class="list-group-item active">会员列表</span>
				{foreach $vip as $v}
					<a href="#" data-id="{$v.id}" data-name="{$v.name}" class="list-group-item">姓名：{$v.name}&nbsp;&nbsp;&nbsp;&nbsp;电话：{$v.tel}&nbsp;&nbsp;&nbsp;&nbsp;余额：{$v.money}</a>
				{/foreach}
			</div>

			<div class="page">
				<div>
					<?php if($page1>1) {?>
					<a class="prev" href="?page1={$page1-1}">&lt;&lt;</a>
					<?php } ?>

					<?php for($i=$pageStart1;$i<=$pageEnd1;$i++) {?>
					<?php if($i==$page1) {?>
					<span class="current">{$i}</span>
					<?php }else{ ?>
					<a class="num" href="?page1={$i}">{$i}</a>
					<?php } ?>
					<?php } ?>

					<?php if($page1<$pageCount1) {?>
					<a class="next" href="?page1={$page1+1}">&gt;&gt;</a>
					<?php } ?>
				</div>
			</div>

		</div>
		<!--	左侧边栏结束-->

		<!--	右边主体开始-->

		<div class="col-xs-9">

			<div class="alert  alert-danger">请先选择借书人！！<button class="close" data-dismiss="alert">&times;</button></div>

			<div class="panel panel-primary">
				<div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#jieshulan">
					<span class="glyphicon glyphicon-book"></span>
					<span id="jieshu">借书人：</span>
				</div>
				<div class="panel-body" id="jieshulan">

				</div>
			</div>

			<div class="panel panel-primary">
				<div class="panel-heading">
					<span class="glyphicon glyphicon-book"></span>
					<span style="line-height: 30px">所有书籍</span>

					<form action="" method="post" class="pull-right">
						<div class="input-group" style="width: 200px">
								<input type="text" class="form-control" aria-label="..." value="" name="inp">
								<div class="input-group-btn">
									<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">类型<span class="caret"></span></button>
									<ul class="dropdown-menu dropdown-menu-right">
											<li><a href="{:url('Login/index')}?book_type=all">全部</a></li>
										{foreach $data1 as $v}
											<li><a href="{:url('Login/index')}?book_type={$v.type}">{$v.type}</a></li>
										{/foreach}
									</ul>
									<button type="submit" class="btn btn-primary "><span class="glyphicon glyphicon-search"></span></button>
								</div>
						</div>
					</form>
				</div>

				<div class="panel-body">
						{foreach $like as $v}
						<div class="img">
							<img src="/{$v.book_url}" class="img1" />
							<div>书名：<a href="#" data-id="{$v.id}">{$v.book_name}</a></div>
							<div>作者：{$v.book_writer}</div>
							<div>类型：{$v.book_type}</div>
							<div>租金：{$v.book_money}元/天</div>
						</div>
						{/foreach}
				</div>

				<div class="panel-footer">
					<div class="page">
						<div>
							<?php if($page>1) {?>
							<a class="prev" href="?page={$page-1}">&lt;&lt;</a>
							<?php } ?>

							<?php for($i=$pageStart;$i<=$pageEnd;$i++) {?>
							<?php if($i==$page) {?>
							<span class="current">{$i}</span>
							<?php }else{ ?>
							<a class="num" href="?page={$i}">{$i}</a>
							<?php } ?>
							<?php } ?>

							<?php if($page<$pageCount) {?>
							<a class="next" href="?page={$page+1}">&gt;&gt;</a>
							<?php } ?>
						</div>
					</div>
				</div>
			</div>

		</div>
<!--	右边主体结束-->
	</div>

	<div class="modal fade" id="z">
		<div class="modal-dialog" style="width:450px;">
			<div class="modal-content">
				<div class="modal-header">
					<button class="close" data-dismiss="modal">&times;</button>
					<span>注销</span>
				</div>
				<div class="modal-body">
					<label class="control-label">确定销毁该账号?</label>
				</div>
				<div class="modal-footer">
					<button type="submit" class="btn btn-danger"><a href="{:url('Login/zhuxiao')}" style="color: white">确定</a></button>
				</div>
			</div>
		</div>
	</div>

	<script>
		let vip_name=$('#vip').find('a');
		let jieshu=$('#jieshu');
		let books=$('.img').find('a');
		let jieshulan=$('#jieshulan');
		$('.alert-danger').hide();

		if(sessionStorage.vipname==null){
			jieshu.text('借书人：请选择借书人')
		}else {
			jieshu.text('借书人：'+sessionStorage.vipname);
		}

		vip_name.click(function () {
			let me=$(this);
			let vip_id=me.data('id');
			let vip_name=me.data('name');
			sessionStorage.vipid=vip_id;
			sessionStorage.vipname=vip_name;
			jieshu.text('借书人：'+sessionStorage.vipname);

			$.get("{:url('Login/lend1')}?vip_id="+vip_id,function(resp){
				if(resp.status){
					if(resp.a[0].length==0){
						let hh='';
						hh='<h5>他没有借书</h5>';
						jieshulan.html(hh);
					}else {
						let html='';
						for (var i=0;i<resp.a.length;i++){
							for (var o=0;o<resp.a[i].length;o++){
								html += "<div class='imgs'>" +
									"<img class='img1' src="+"/"+resp.a[i][o]['book_url']+ ">"+
									"<div>"+'书名：'+resp.a[i][o]['book_name']+"</div>"+
									"<div>"+'作者：'+resp.a[i][o]['book_writer']+"</div>"+
									"<div>"+'类型：'+resp.a[i][o]['book_type']+"</div>"+
									"<div>"+'租金：'+resp.a[i][o]['book_money']+'元/天'+"</div>"+
									"<button class='btn btn-primary' data-id="+resp.a[i][o]['id']+">取消</button>"+
									"</div>";
								jieshulan.html(html);
							}
						}
					}
				}
			});
		});

		books.click(function () {
			let me=$(this);
			let book_id=me.data('id');
			sessionStorage.bookid=book_id;

			if(sessionStorage.vipid!=null&&sessionStorage.bookid!=null){
				$.get('{:url("Login/lend")}?vip_id='+sessionStorage.vipid+'&books_id='+sessionStorage.bookid,function(resp){
					let html='';
					for (var i=0;i<resp.length;i++){
						for (var o=0;o<resp[i].length;o++){
							html += "<div class='imgs'>" +
									"<img class='img1' src="+"/"+resp[i][o]['book_url']+ ">"+
									"<div>"+'书名：'+resp[i][o]['book_name']+"</div>"+
									"<div>"+'作者：'+resp[i][o]['book_writer']+"</div>"+
									"<div>"+'类型：'+resp[i][o]['book_type']+"</div>"+
									"<div>"+'租金：'+resp[i][o]['book_money']+'元/天'+"</div>"+
									"<button class='btn btn-primary'>取消</button>"+
									"</div>";
							jieshulan.html(html)
						}
					}
				});
			}
			if(sessionStorage.vipid==null){
				$('.alert-danger').show();
				setTimeout(function(){
					$('.alert-danger').hide();
				},2000);
			}
		});


		if(sessionStorage.vipid!=null){
			$.get("{:url('Login/lend1')}?vip_id="+sessionStorage.vipid,function(resp){
				if(resp.status){
					if(resp.a[0].length==0){
						let hh='';
						hh='<h5>无内容</h5>';
						jieshulan.html(hh);
					}else {
						let html='';
						for (var i=0;i<resp.a.length;i++){
							for (var o=0;o<resp.a[i].length;o++){
								html += "<div class='imgs'>" +
									"<img class='img1' src="+"/"+resp.a[i][o]['book_url']+ ">"+
									"<div>"+'书名：'+resp.a[i][o]['book_name']+"</div>"+
									"<div>"+'作者：'+resp.a[i][o]['book_writer']+"</div>"+
									"<div>"+'类型：'+resp.a[i][o]['book_type']+"</div>"+
									"<div>"+'租金：'+resp.a[i][o]['book_money']+'元/天'+"</div>"+
									"<button onClick='f(this.id)' class='btn btn-primary' id="+resp.a[i][o]['id'] +">取消</button>"+
									"</div>";
								jieshulan.html(html);
							}
						}
					}
				}
			});
		}


		function f(aa) {
			console.log(aa);
		}
	</script>
</body>
</html>